import { Component, OnInit, Input } from '@angular/core';
import { DataService } from '../../services/data.service';
import { trigger,state,transition,style,animate } from '@angular/animations';
// 当做一个服务
import {HttpClient, HttpHeaders} from "@angular/common/http";
import { HttpserviceService } from '../../services/httpservice.service'
import { equal } from 'assert';
declare var $: any;
@Component({
  selector: 'app-content',
  templateUrl: './content.component.html',
  styleUrls: ['./content.component.scss']
})
export class ContentComponent implements OnInit {
  @Input() current: number;


  constructor(
    public data: DataService,
    public http: HttpClient,
    public httpService: HttpserviceService
  ) { }

  presentObj() {
    return this.data.content[this.current];
}

IsPaging() {
  return this.data.content[this.current].isPaging;
}

  ngOnInit() {

    
    
  }
  ngOnChanges() {
    
  }

  // in() {
  //   $(".page").each(function() {
  //     var $page = $(this);
  //     $page.data('originalClassList', $page.attr('class'));
  //     console.log($page.data('originalClassList', $page.attr('class')));
      
  // });
  // }

  nextOk() {
    this.data.content[this.current].isPaging = true;

  }

  page(a) {
    let b= this.presentObj().hostHalo;
    let c=this.presentObj().animation;
    c[a-1].state= true;
    b[a-1] = '';
        if (b.indexOf("halo") == -1) {
            this.presentObj().isPaging = true;
        }
    
  }

  /**
   * 
   * 
   * 
   */
  list:any;
  getData() {
    // 服务器允许跨域
    let api = "http://a.itying.com/api/productlist";
    this.http.get(api).subscribe((response:any) => {
      console.log(response)
      this.list= response.result;
    })
  }


  doLogin() {
    const httpOptions = {
      headers: new HttpHeaders({ 'Content-Type': 'application/json' })
      };
      let api = "http://127.0.0.1:3000/doLogin";
      this.http.post(api,{username:'张三',age:'20'},httpOptions).subscribe((Response) => {
        console.log(Response)
      })
  }


  getJsonData() {
    let api = "http://a.itying.com/api/productlist";
    this.http.jsonp(api,'callback').subscribe((response) =>{
      console.log(response)
    })
  }


  getAxiosData() {
    let api = "http://a.itying.com/api/productlist";
    this.httpService.axiosGet(api).then((data) => {
      console.log(data)
    })

  }

  // init() {
  //   $(".page").each(function() {
  //     let $page = $(this);
  //     $page.data('originalClassList', $page.attr('class'));
  //     console.log($page.data('originalClassList', $page.attr('class')))
  //   })
  // }
  // public endCurrPage = false;
  // public endNextPage = false;
  
  
  // run(num){
    
  //   let $currPage = $(".page").eq(num);
  //   let $nextPage = $(".page").eq(num).addClass('pt-page-current'),
  //       outClass='',
  //       inClass= '';
  //       switch (1) {
  //         case 1:
  //             outClass = 'pt-page-rotateSlideOut';
  //             inClass = 'pt-page-rotateSlideIn';
  //             break;

  //     }
  //     $currPage.addClass(outClass).on(function() {
  //       this.endCurrPage = true;
  //       if (this.endNextPage) {
  //           this.onEndAnimation($currPage, $nextPage);
  //       }
  //   });
  //   $nextPage.addClass(inClass).on(function() {
  //     this.endNextPage = true;
  //     if (this.endCurrPage) {
  //         this.onEndAnimation($currPage, $nextPage);
  //     }
  // });
  // }


  // onEndAnimation($outpage, $inpage) {
  //   this.endCurrPage = false;
  //   this.endNextPage = false;
  //   this.resetPage($outpage, $inpage);
  // }

  // resetPage($outpage, $inpage) {
  //   $outpage.attr('class', $outpage.data('originalClassList'));
  //   $inpage.attr('class', $inpage.data('originalClassList') + ' pt-page-current');
  // }

  // animEndEventName = 'animationend'
  // run(num) {
  //   let haha
  //   let $currPage =  $(".page").eq(num-1);
  //   let $nextPage = $(".page").eq(num).addClass('pt-page-current');
    
  //   $nextPage.addClass('pt-page-rotateSlideIn').on('animationend' ,()=>{
  //     $nextPage.off(this.animEndEventName);
  //     this.init($currPage,$nextPage)
  //   });
  //     $currPage.addClass('pt-page-rotateSlideOut').on('animationend' ,() => {
  //       $currPage.off(this.animEndEventName);
  //       this.init($currPage,$nextPage)
  //     });
  // }

  

  // init($outpage:any, $inpage:any){
  //   $outpage.attr('class', $outpage.data('originalClassList'));
  //   console.log($outpage.data('originalClassList'))
  //   $inpage.attr('class', $inpage.data('originalClassList') + ' pt-page-current');
  // }






}
